<template>
	<view class="page">
		<view v-for="(item,index) in list" :key="index" @click="open(item)" 
			style="position: relative;  background: #fff;width: 700rpx;margin:20rpx auto;padding: 20rpx;border-radius: 20rpx;">
			<view class="u-flex">
				<view
					style="line-height: 50rpx; background: #0091da;border-radius: 100%;width: 50rpx;height: 50rpx; text-align: center;">
					<u-icon name="bell-fill" color="#fff"></u-icon>
				</view>
				<view class="u-margin-left-20">{{item.title}}</view>
			</view>
			<view class="u-margin-top-20 u-type-info u-line-2">{{item.content}}</view>
			
			
			<view @click.stop="read(item)" style="position: absolute;right: 10rpx;top: 10rpx;">
				<u-icon name="close-circle-fill" color="#bfbfbf" size="30"></u-icon>
			</view>
			
		</view>
		
		<u-popup v-model="show" mode="center"  border-radius="20" width="600">
			
			<view class="u-padding-20" style="background: #fff;">
				{{content}}
			</view>
			
		</u-popup>
		<u-toast ref="uToast" />
	</view>
</template>

<script>
	import loader from '@/common/loadPage.js';
	export default {
		mixins: [loader],
		data() {

			return {
				content:'',
				show:false,
				tabbar: [],
				nav: [],
				current: 0,
				list: [],
				initial: {
					geturl: "/api/Alliance/message",
					isPage: true
				},
			}
		},
		async onLoad() {

			this.getGoods()
		},
		methods: {
              open(item){
				  this.show=true
				  this.content=item.content
			  },
			  read(item){
				  this.$u.post('/api/Alliance/messageDel', {
				  	id	: item.id
				  }).then(res => {
				  	this.$refs.uToast.show({
				  		title: '删除成功',
				  		type: 'success',
				  		callback: () => {
				  			this.initial.page = 1;
				  			this.getGoods()
				  		}
				  	})
				  }).catch(err => {
				  
				  })
				  
			  }

		}
	}
</script>


<style>
	.page {
		background: #F1F1F1;
		min-height: 100vh;
		display: inline-block;
		width: 750rpx;
	}

	.list {
		background: #fff;
		width: 700rpx;
		margin: 20rpx auto;
		padding: 20rpx;
	}
</style>
